@CHARSET "UTF-8";
body{
	background:#DAD5C1;
	font-family:"Helvetica", "Arial",Tahoma;
}
h3{
	text-align:center;
	text-decoration: underline;
}
p{
	padding: 2%;
}
img{
	text-align:center;
	max-width:100%;
	height:auto;
	width:auto;
}
#wrapper{
	margin:0 auto;
	max-width: 980px;
	width:96%;
	background:#C88898;
	padding:2%;
	border-radius:10px;
}
header{
	padding: 5px;
	text-align:center;
}
nav{
	background:#A09885;
	padding:0;
	margin:0 0;
	border-radius:10px;
}
nav ul{
	list-style:none;
	margin-left:7%;
	padding:0;
}
nav li a{
	color: #000;
	display:block;
	float:left;
	padding:20px;
	text-decoration:none;
}
nav a:hover, nav li.active a{
	background-color:#322F2C;
	color:#fff;
}
.clear{
	clear:both;
}
#social{
	text-align:center;
}
#social img{
	padding-top:5px;
	height:50px;
	width:50px;
}
.left-col{
	background:#DAD5C1;
	width: 60%;
	float:left;
	margin-top:2%;
	border-radius:10px;
}
.sidebar{
	background:#DAD5C1;
	width: 38%;
	float:right;
	margin-top:2%;
	border-radius:10px;
}
.sidebar1{
	background:#DAD5C1;
	width: 60%;
	float:left;
	margin-top:2%;
	border-radius:10px;
}
.vid{
	position:relative;
	padding-bottom:56.25%;
	padding-top:30px;
	height:0;
	overflow:hidden;
}
.vid iframe{
	position:absolute;
	top :0;
	left:0;
	width:100%;
	height:100%;
}
footer{
	background:#A09885;
	border-radius:50px;
}

/* @media all and (min-width:500px){
	
}
@media all and (min-width:500px) and (max-width:860px){
	#wrapper{
	width: 650px;
	height : auto;	
	margin : 0 auto;
	}
	#title{
	width: 402px;
	height: 162px;
	top:177px;
	}
	#board{
	width: 648px;
	height: 326px;
	top:602px;
		
	}
	#guest{
	width: 402px;
	height: 250px;
	top:345px;
	
	}	
	#member{
	width: 240px;
	height: 585px;
	top:10px;
	left:408px;		
	}
	#login{
	width: 402px;
	height: 160px;
	top:10px;
	}
	#ect1{
	width: 326px;
	height: 256px;
	top:935px;	
	}
	#ect2{
	width: 315px;
	height: 258px;
	top:935px;
	left:340px;
		
	}

}

@media all and (min-width:861px){
	#mainpage{
	width: 980px;
	height : auto;	
	margin : 0 auto;
	}
	#title{
	width: 402px;
	height: 162px;
	top:245px;
	}
	#board{
	width: 573px;
	height: 328px;
	top:535px;
	left:408px;	
	}
	#guest{
	width: 402px;
	height: 450px;
	top:413px;
	
	}	
	#member{
	width: 240px;
	height: 519px;
	top:10px;
	left:408px;	
	}
	#login{
	width: 402px;
	height: 229px;
	top:10px;
	}
	#ect1{
	width: 326px;
	height: 256px;
	top:10px;
	left:655px;	
	}
	#ect2{
	width: 326px;
	height: 258px;
	top:271px;
	left:655px;	
	}
}
 */